<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<c:set var="baseurl" value="${pageContext.request.contextPath}/"></c:set>
<%@ include file="/WEB-INF/JSP/tag.jsp"%>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name=renderer content=ie-stand>
<title>欢迎登录驾校管理系统</title>
<link rel="stylesheet" href="<%=path%>/CSS/lib.css" type="text/css" media="screen" title="no title" charset="utf-8">
<link rel="stylesheet" type="text/css" href="${baseurl}easyUI1.4.1/themes/default/easyui.css">
<style>
.pop-win {position:fixed;top:0px;left:0px;width:100%;height:100%;}
#pop-main {position:absolute;width:670px;height:400px;background-image: url(${baseurl}images/login/logininfo.png);}
/*默认文字颜色*/
:-moz-placeholder {  color: #ccc; opacity:1; }
::-moz-placeholder {color: #ccc;opacity:1;}
input:-ms-input-placeholder{color: #ccc;opacity:1;}
input::-webkit-input-placeholder{color: #ccc;opacity:1;}
.text_inputClass{font-size:14px;width:270px;border :0px;outline:none;height: 40px; border:none;line-height:40px; padding-left:44px;}
 li {list-style-type:none;}
.hui_borderClass {border-bottom: 1px solid #ccc;}
.lan_borderClass {border-bottom: 1px solid #57a0ff;}


.custom-checkbox input{position:absolute;left:2px;top:2px;margin:0;}
.custom-checkbox label{display:block;position:relative;font-size:1.3em;padding-right:1em;line-height:1;padding:.5em 0 .5em 30px;margin:0 0 .3em;cursor:pointer;}
/* states */
.custom-checkbox label{background:url(<%=path%>/images/login/checkbox.gif) no-repeat;}
.custom-checkbox label,.custom-radio label{background-position:-10px -14px;}
.custom-checkbox label.hover,.custom-checkbox label.focus,.custom-radio label.hover,.custom-radio label.focus{background-position:-10px -114px;}
.custom-checkbox label.checked,.custom-radio label.checked{background-position:-10px -214px;}
.custom-checkbox label.checkedHover,.custom-checkbox label.checkedFocus{background-position:-10px -314px;}
.custom-checkbox label.focus,.custom-radio label.focus{outline:1px dotted #ccc;}

</style>
<script  src="<%=path%>/JS/loginjs/jquery.min.js"type="text/javascript" ></script>
<script  src="<%=path%>/JS/loginjs/jquery.ez-bg-resize.js" type="text/javascript"  charset="utf-8"></script>
<script  src="<%=path%>/JS/loginjs/custominput.js" type="text/javascript"  charset="utf-8"></script>
<!--EasyUI的js包 -->

</head>
<body >
	<div  class="pop-win">
       <div  class="pop-main" id="pop-main"style="display:none">
	       	<div style="position: relative;left: 280px;width: 325px;top:10px">
	       		<div style="background: #fff;width: 325px;height: 315px;padding-top: 60px;padding-left: 35px;">
	       			<b style="color: #57a0ff;">用户登录</b><span style="color:#999">/UserLogin</span>
				<form id="loginform"method="post"  action="">
				   <div class="hui_borderClass"id="div_user_id" style="width: 300px;outline:none;cursor: pointer;padding: 30px 0 0 10px;">
				    	<input name="username" type="text"id="user_id"value="<%= userName%>"  class="text_inputClass" placeholder="请输入用户名"
				    		style="background:url(<%=path%>/images/login/yhmmr.png) center left no-repeat;"  />
				    </div>
				    <div class="hui_borderClass"id="div_pwd_id" style="width: 300px;outline:none;cursor: pointer;padding: 30px 0 0 10px;">
				    	<input name="password" type="password" type="text" id="pwd_id"
				    		placeholder="请输入密码" class="text_inputClass" value="<%= password%>"
				    		style="background:url(<%=path%>/images/login/mmmr.png) center left no-repeat;"  />
				    </div>
<!-- 				   <div style="height:50px;width: 330px;outline:none;cursor: pointer;">
				    	<div class="hui_borderClass"id="div_randomcode" style="float: left;height:40px;width: 175px;padding-left: 10px;padding-top: 20px;">
				    		
					    	<div style="float: left;">
						    	<input  name="captcha" type="text"  id="randomcode"
						    		placeholder="请输入验证码" class="text_inputClass"
						    		style="float: left;width: 170px;background:url(images/login/yzmmr.png) center left no-repeat; "  />
					    	</div>
				    	</div>
				    	<ul style="float: left;margin: 0px;padding-left: 25px;">
				    		<li style="height: 45px;">
				    			<img id="randomcode_img" onclick="javascript:randomcode_refresh()" src="images/kaptcha.jpg"style="width: 100px;height: 35px;margin-top: 10px;"/> 
				    		</li>
				    		<li style="height: 19px;">
				    			<a style="font-size: 14px;color: #999;"
				    				 href="javascript:void(0)" onclick="javascript:randomcode_refresh()"><u>看不清？换一张</u></a>
				    		</li>
				    	</ul>	
				   		
				    	
				   </div> -->
				   <br />
				   <div>
					   	<div style="color:#f37b1b;font-size: 15px;margin:10px 0 10px 10px;">
					   	 <b><span  id='unifo_login_span_id' >
					   	 <%  
					        Object obj = request  
					                .getAttribute(FormAuthenticationFilter.DEFAULT_ERROR_KEY_ATTRIBUTE_NAME);  
					        String msg = "";  
					        if (obj != null) {  
					            if (obj instanceof IncorrectCaptchaException)  
					                msg = "验证码错误！";  
					            else   
					                msg = "账号或密码错误！";  
					        }else{
					            if(request.getAttribute("message")!= null){
					            	msg=(String)request.getAttribute("message");
					            }
					        }
					        out.println("<span >" + msg + "</span>");  
					    %>   </span>&nbsp;&nbsp;</b>
					   	</div>
					   	<div>
						   	<div  id="login1" style="cursor:pointer;float: left;color: #fff;border-radius: 5px;background-color: #57a0ff;width: 185px;height: 30px;margin: 0 ; text-align: center; padding-top: 5px;">
						   		<b>登录</b>
						   	</div>
					   		<%--<div style="float: left;margin-left: 10px;margin-top: 5px;">
					   		
					   		
					   			<input  name="remember" style="display:none" value="" id="remember" />
					   		
					   		<input type="checkbox" class="input" name="rememberMe"id = "remember_id"<% if(remember=="Y"){out.println("checked='checked'");} %>style="width:0px;height:0px;border:none;outline:none;" />
							<label for="remember_id" style='font-size:14px;margin-left:10px'>记住我</label>
					   			
		    					&lt;%&ndash; <label  class="labelClass"><input name="rememberMe"id = "remember_id" type="checkbox"<% if(remember=="Y"){out.println("checked='checked'");} %>value=""  /><span></span></label>
					   		 &ndash;%&gt;
					   		</div>--%>
					   		<!-- <div style="float: left;margin-top: 2px;"onclick="setRemember()"  name="remember">
					   			<span style="font-size: 15px;color: #999;">记住我</span>
					   			
					   		</div> -->
					   	</div>
				   </div>
				  
				   
			    </form>
	       		</div>
	       	</div>
    	</div>
    </div>
<script  type="text/javascript" charset="UTF-8">
 //IE不支持console对象，此代码仅为测试使用
///////////////////////////////////////
window.console = window.console || (function () {
    var c = {}; c.log = c.warn = c.debug = c.info = c.error = c.time = c.dir = c.profile  
    = c.clear = c.exception = c.trace = c.assert = function () { };  
    return c;  
})();  
//////////////////////////////////////
var btnFlag = true;

//重置验证码
function randomcode_refresh(){
	$("#randomcode_img").attr("src","${baseurl}images/kaptcha.jpg?"+ Math.random());
}
function dologin(){
	//重置提示信息
    $("#unifo_login_span_id").text("    ");
	var epwd = $("#pwd_id").val();//用户输入密码
	var username=$("#user_id").val();
	if(username == "" || username == null ||epwd == "" || epwd == null){
    	$("#unifo_login_span_id").text("账户、密码必须填写");
    	$.messager.progress('close');
    	return;
    }
	/* var randomcode = $("#randomcode").val();
	if(randomcode == "" || randomcode == null ){
    	$("#unifo_login_span_id").text("验证码必须填写");
    	return;
    } */
	//校验非法字符
	var patrn=/[!#@$%^&*()_+<>?:"{},\/;'[\]]/;
	if(patrn.test(username)||patrn.test(epwd)){  
		$("#unifo_login_span_id").text("账户、密码非法字符");
		return true;     
	}
	//没有雪花，所以这样防止重复提交
	if(!btnFlag){
		return;
	}
	
	//var password=$("#pwd_id").val();
	        
   	//重置提示信息
    $("#unifo_login_span_id").text(" ");
    //用户是否点亮 记住密码按钮
    
    if(btnFlag){
   		btnFlag = false;
   	}else{
   		$.messager.progress('close');
   		return;
   	}
    var saveFlag = $('#remember_id').is(':checked');
    $("[name='rememberMe']").attr("value",saveFlag);
    $("[name='remember']").attr("value",saveFlag);
    $("#loginform").submit();
    return;
	
}	
$(document).ready(function() {
	$("body").ezBgResize({
		img     : "${baseurl}images/login/BJ.png", 
		opacity : 1,
		center  : true 
	});
	//IE不支持淡入
	if (window.navigator.userAgent.indexOf("MSIE")>=1){
		$('#pop-main').attr("style","");
	}else{
		$('#pop-main').fadeIn(2700);
	}
	
	
});
window.onload = function() {
	var oMain = document.querySelector('#pop-main');
	
	oMain.style.left = (document.documentElement.clientWidth - oMain.offsetWidth) / 2 +'px';
	oMain.style.top = (document.documentElement.clientHeight - oMain.offsetHeight) / 2 +'px'; 
	
} 
$(function(){
    //注册键盘事件
	document.onkeydown = function(e) {
	    //捕捉回车事件
	    var ev = (typeof event!= 'undefined') ? window.event : e;
	    if(ev.keyCode == 13) {
	    	dologin();
	    }
	}
	$("#login1").click(function(){
		 dologin();
	 	   
	}); 
});   
$(function(){
	 $('.input').customInput();
});
$(".text_inputClass").blur(function(){
	var id = $(this).attr("id");
	var divObj = $("#div_"+id);
	divObj.attr("class","hui_borderClass");
	if(id == 'randomcode'){
		$(this).attr("style","float: left;width: 170px;background:url(${baseurl}images/login/yzmmr.png) center left no-repeat;")
	}else if(id == 'pwd_id'){
		$(this).attr("style","background:url(${baseurl}images/login/mmmr.png) center left no-repeat;");
	}else if(id == 'user_id'){
		$(this).attr("style","background:url(${baseurl}images/login/yhmmr.png) center left no-repeat;");
	}
})
$(".text_inputClass").focus(function(){
	var id = $(this).attr("id");
	var divObj = $("#div_"+id);
	divObj.attr("class","lan_borderClass");
	if(id == 'randomcode'){
		$(this).attr("style","float: left;width: 170px;background:url(${baseurl}images/login/yzm.png) center left no-repeat;")
	}else if(id == 'pwd_id'){
		$(this).attr("style","background:url(${baseurl}images/login/mm.png) center left no-repeat;");
	}else if(id == 'user_id'){
		$(this).attr("style","background:url(${baseurl}images/login/yhm.png) center left no-repeat;");
	}
});
</script> 
</body>
</html>